<!DOCTYPE>
<html>
<head>
	<meta charset="UTF-8">
	<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0,  maximum-scale=1.0">
	<title>Semantic UI</title>
	<link href="./second/css/semantic.min.css" rel="stylesheet">

</head>
<body >
<!-- <body style="height:9000px;"> -->
	<!-- <div class="ui container" style="background: #3498db;"> -->
		<!-- top controller -->
		<div class="ui top fixed four item teal grid inverted menu">
			<a class="two wide column item primary">
			  Logo
			</a>
			<a class="six wide column item active">
			  感兴趣的
			</a>
			<a class="six wide column item">
			  大家
			</a>
			<!-- <div class="one wide column item">
			  <i class="plus icon"></i>
			</div> -->

			  
			
			<div class="two wide  column item" id="dynamic_plus">
				<div class="ui inline dropdown " tabindex="0">
    				<div class="text">
    				</div>
    				<i class="plus icon"></i>
    				<div class="grid inverted teal menu transition hide" tabindex="-1">
	      				<div class="item" data-text="today">今天</div>
	      				<div class="item" data-text="this week">本周</div>
	      				<div class="item" data-text="this month">本月</div>
    				</div>
				</div>
			</div>
		</div>

		<div class="ui container" style="margin-top:50px;">
		<div class="very relaxed items">
			<div class="item">
				<div class="image">
			      	<!-- <img src="/images/wireframe/image.png"> -->

			    </div>
			    <div class="content">
			      	<a class="ui header" href="#link">超链接标题</a>
			      	<div class="description">
			        	<p>从明天起，做一个幸福的人。喂马、劈柴，周游世界。从明天起，关心粮食和蔬菜。我有一所房子，面朝大海，春暖花开。从明天起，和每一个亲人通信。告诉他们我的幸福。那<a href="#link">幸福</a> 的闪电告诉我的。我将告诉每一个人，给每一条河每一座山取一个温暖的名字。陌生人，我也为你祝福。愿你有一个灿烂的前程。愿你有情人终成眷属。愿你在尘世获得幸福。我只愿面朝大海，春暖花开。</p>
			      	</div>
			    </div>
			</div>
			
			<div class="ui divider"></div>

			<div class="item">
			    <div class="image">
			      		<!-- <img src="/images/wireframe/image.png"> -->
			    </div>
			    <div class="content">
			      	<a class="ui header" href="#link">超链接标题</a>
			      	<div class="description">
			        	<p>从明天起，做一个幸福的人。喂马、劈柴，周游世界。从明天起，关心粮食和蔬菜。我有一所房子，面朝大海，春暖花开。从明天起，和每一个亲人通信。告诉他们我的幸福。那<a href="#link">幸福</a> 的闪电告诉我的。我将告诉每一个人，给每一条河每一座山取一个温暖的名字。陌生人，我也为你祝福。愿你有一个灿烂的前程。愿你有情人终成眷属。愿你在尘世获得幸福。我只愿面朝大海，春暖花开。</p>
			      	</div>
			    </div>
			</div>
		</div>
		</div>
		
		<div class="ui container">
		<div class="ui divider"></div>
		<div class="ui relaxed divided items">

			<div class="item">
  				<div class="ui tiny image">
    				<!-- <img src="/images/wireframe/image.png"> -->
    				<img class="ui avatar image" src="./second/images/square-image.png">
					<span>Username</span>
  				</div>
  				<div class="content">
    				<a class="header">内容标题</a>
    				<div class="description">
      					对内容的一段简短描述。
    				</div>
			        <div class="extra">
			          	11 
			          	<div class="ui heart rating" data-rating="0" data-max-rating="1">
			          		<i class="icon"></i>
			          	</div>
			        </div>
  				</div>
			</div>

			<div class="item">
  				<div class="ui tiny image">
    				<!-- <img src="/images/wireframe/image.png"> -->
    				<!-- <img class="ui avatar image" src="./second/images/square-image.png">
    				 Elliotdasfaaaaaaaaaaaaaaaaaaaaaaaa -->
    				 <div class="ui special cards">
    				 <div class="card">
					    <div class="blurring dimmable image">
					      <div class="ui dimmer">
					        <div class="content">
					          <div class="center">
					            <div class="ui inverted button">Add Friend</div>
					          </div>
					        </div>
					      </div>
					      <img src="./second/images/square-image.png">
					    </div>
					    
					  </div>
					  </div>afdds
  				</div>
  				<div class="content">
    				<a class="header">内容标题</a>
    				<div class="description">
      					对内容的一段简短描述。
    				</div>
    				<div class="extra">
      					42 
      					<div class="ui heart rating" data-rating="0" data-max-rating="1">
      						<i class="icon"></i>
      					</div>
    				</div>
  				</div>
			</div>

	    	<div class="item">
	      		<div class="ui tiny image">
	        		<!-- <img src="/images/wireframe/image.png"> -->
	        		<img class="ui avatar image" src="./second/images/square-image.png">
					<span>Username</span>
	      		</div>
	      		<div class="content">
	        		<a class="header">内容标题</a>
	        		<div class="description">
	          			对内容的一段简短描述。
	        		</div>
	        		<div class="extra">
	          			16 
	          			<div class="ui heart rating" data-rating="0" data-max-rating="1">
	          				<i class="icon"></i>
	          			</div>
	        		</div>
	      		</div>
	    	</div>

	    	<div class="ui divider" ></div>
	  	</div>
	  	</div>

		<!-- bottom controller -->
		<!-- <div class="ui top fixed four item teal grid inverted menu"> -->
		<div class="ui bottom fixed four item teal grid inverted  menu">
			<a class="item active">
			  动态
			</a>
			<a class="item">
			  提问
			</a>
			<a class="item">
			  提问
			</a>	
			<a class="item">
			  <i class="user icon"></i>用户中心
			</a>
		</div>

		<!-- <div class="ui top fixed  grid small menu">
			<div class="one wide column">
				<a class="item">
					
				</a>
			</div>
			<div class="seven wide column">
				<a class="item">
					感兴趣的
				</a>
			</div>
			<div class="seven wide column">
				<a class=" item">
					大家
				</a>
			</div>
			<div class="one wide column">
				<a class=" item">
					<i class="plus icon"></i>
				</a>
			</div>
		</div> -->

		<!-- <div class="ui bottom fixed small grid  menu">
			<div class="four wide column">
				<a class="item">
					动态
				</a>
			</div>
			<div class="four wide column">
				<a class="item">
					提问
				</a>
			</div>
			<div class="four wide column">
				<a class=" item">
					下三
				</a>
			</div>
			<div class="four wide column">
				<a class=" item">
					<i class="user icon"></i>用户中心
				</a>
			</div>
		</div> -->
		<!-- <div class="ui bottom grid">
			<div class="four wide column">动态</div>
			<div class="four wide column">提问</div>
			<div class="four wide column">下三</div>
			<div class="four wide column">
				<i class="user icon"></i>用户中心
			</div>
		</div> -->
	<!-- </div> -->
	<script type="text/javascript" src="./second/js/jquery-2.1.4.min.js"></script>
	<script type="text/javascript" src="./second/js/semantic.min.js"></script>
	<script type="text/javascript" src="./second/js/UIController.js"></script>
	<script type="text/javascript">
		$('.dropdown').dropdown({
                fullTextSearch: true,
            });
	</script>
</body>
</html>